<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div class="div1" value="1">
        lin
    </div>
    <script>
        // onload事件之后dom加载完成
        window.onload = function () {
            var d1 = document.getElementsByTagName('div')[0] //拿到元素节点
            var a1 = d1.getAttributeNode('class')//拿到属性节点
            var t1 = d1.firstChild //拿到文本节点
            var v1 = d1.getAttribute('class') //拿到属性值
            console.log(a1, v1, t1);
            // 元素节点的type是1 属性是2 文本是3
            console.log(d1.nodeType, a1.nodeType, t1.nodeType);
            // DIV class #text
            console.log(d1.nodeName, a1.nodeName, t1.nodeName);
            // null "div1" "\n        lin\n    "
            console.log(d1.nodeValue, a1.nodeValue, t1.nodeValue);
        }

    </script>
</body>

</html>